<template>
	<view class="record">
		<nav-bar></nav-bar>
		<view class="t_container">
			<view class="title">
				肺活量采集记录
			</view>
		</view>
		<view class="m_container">
			<view class="tabel">
				<view class="t-h">
					<view class="t-d time">
						采集时间
					</view>
					<view class="t-d">
						肺活量(ml)
					</view>
				</view>
				<view class="t-b">
					<view class="t-r" v-for="(item,index) in recordList" :key="index">
						<view class="t-d time">
							{{ item.createTime }}
						</view>
						<view class="t-d">
							{{ item.inhaleVol }}
						</view>
					</view>
				</view>
			</view>
		</view>
		<view class="large_button" @click="$u.throttle(next, 1500)">下一步</view>
	</view>
</template>
<script>
	import {
		findEffectiveData,
		findRegisterSucceed,
	} from '@/api/index.js'
	import {
		mapState
	} from 'vuex'
	let app = getApp()
	export default {
		data() {
			return {
				userId: uni.getStorageSync('userId'),
				paddingHeight: uni.getStorageSync('navbarHeight'),
				globalData: app.globalData,
				flag: 0,
				title: undefined,
				recordList: [],
				info: {}
			}
		},
		computed: {
			...mapState({
				ble: state => state.ble, // 实时蓝牙全局状态
				userInfo: state => state.userInfo
			})
		},
		onLoad(OPTIONS) {
			console.log(OPTIONS)
			this.flag = Number(OPTIONS.flag)
			this.fetchData()
		},
		methods: {
			async fetchData() {
				let params = {
					bodyId: this.userInfo.id,
					flag: this.flag
				}
				try {
					const res = await findEffectiveData(params)
					this.recordList = res.data
				} catch (e) {
					//TODO handle the exception
				}
			},
			async next() {
				let params = {
					bodyId: this.userInfo.id
				}
				const res = await findRegisterSucceed(params)
				if (res.data == 1) {
					uni.redirectTo({
						url: `/pagesB/login/device/measure/tips`
					})
				}
			}
		}
	}
</script>
<style lang="scss" scoped>
	.t_container {
		width: 100%;
		height: 556rpx;
		background-image: url('http://oss.antaimedical.com/images/static/2024/08/66ac9a14e4b000d2c606b51bKtP0NbqctY5U39a744c1b547badc117d392dbc405dfb.png');
		background-size: 100% 100%;
		background-repeat: no-repeat;
		padding: 208rpx 80rpx 0;

		.title {
			font-weight: 500;
			font-size: 36rpx;
			color: #FFFFFF;
			font-family: PingFangSC-Medium, PingFang SC;
			text-align: left;
		}
	}

	.m_container {
		width: 100%;
		min-height: 800rpx;
		background-color: #fff;
		border-radius: 48rpx 48rpx 0rpx 0rpx;
		margin-top: -264rpx;
		padding: 48rpx;

		.tabel {
			width: 100%;

			.t-r,
			.t-h {
				width: 100%;
				height: 88rpx;
				display: flex;
				align-items: center;
				margin-bottom: 8rpx;
				border-radius: 16rpx;
				padding: 16rpx 0;
				background: rgba(#545DDE, .05);

				.t-d {
					width: 50%;
					line-height: 56rpx;
					font-weight: 500;
					font-size: 28rpx;
					color: #545DDE;
					font-family: PingFangSC-Medium, PingFang SC;
				}

				.time {
					border-right: 2rpx solid #FFFFFF;
				}
			}
		}
	}

	.large_button {
		position: fixed;
		bottom: 76rpx;
		left: 50%;
		transform: translateX(-50%);
	}
</style>